<template>
  <div class="container">
    <!-- <input type="text" v-lazyimg /> -->
    <HomeCategory />
    <HomeBanner />
    <!-- 测试 加冒号会将字符串类型转换个number类型 -->
    <!-- <XtxSkeleton width="100" height="100" bg="blue" /> -->
    <!-- <HomePanel title="热卖" subTitle="海贼王路飞">
      <template #right>
        <XtxMore path="/" />
      </template>
    </HomePanel> -->
    <HomeNews />
    <HomeHot />
    <HomeProduct />
  </div>
</template>

<script>
import HomeCategory from '@/views/Home/components/HomeCategory.vue'
import HomeBanner from '@/views/Home/components/HomeBanner.vue'
// import HomePanel from '@/views/Home/components/HomePanel.vue'
import HomeNews from '@/views/Home/components/HomeNew.vue'
import HomeHot from '@/views/Home/components/HomeHot.vue'
import HomeProduct from '@/views/Home/components/HomeProduct.vue'
import { getCurrentInstance, onMounted } from 'vue'
export default {
  components: { HomeCategory, HomeBanner, HomeNews, HomeHot, HomeProduct },
  setup () {
    onMounted(() => {
      const thisVue = getCurrentInstance()
      console.log('v3', thisVue.appContext.config.globalProperties)
    })
    return {}
  },
  created () {
    // v2 获取全局属性
    console.log('v2', this.load)
  }
}
</script>

<style lang="less" scoped>
// 手动引入less文件 =》 使用里面定义的less的全局变量
// @import "~@/style/variables.less";
.container {
  color: @warnColor;
}
</style>
